<!-- Main content -->
<section>
  <div class="row">
    <div class="col-md-6">
      <div class="form-check form-switch">
        <input
          type="checkbox"
          class="form-check-input"
          ng-model="$ctrl.selectedList.isSelectAll"
          ng-change="$ctrl.selectAll($ctrl.exportData.pages)"
          id="switchSelectAllPages"
        />
        <label class="custom-control-label" for="switchSelectAllPages"
          >Select all pages</label
        >
      </div>
    </div>
    <div class="col-md-6">
      <div class="form-check form-switch">
        <input
          type="checkbox"
          class="form-check-input"
          ng-model="$ctrl.selectedList.isExportData"
          ng-change="$ctrl.selectAll($ctrl.exportData.pages)"
          id="switchSelectAllData"
        />
        <label class="custom-control-label" for="switchSelectAllData"
          >With Data</label
        >
      </div>
    </div>
  </div>
  <hr />
  <div class="row justify-content-md-left">
    <div
      class="col-md-4 mb-2"
      ng-repeat="page in $ctrl.exportData.pages track by page.id"
    >
      <div class="form-check form-switch">
        <input
          type="checkbox"
          class="form-check-input"
          ng-model="page.isActived"
          ng-change="$ctrl.updatePageExport()"
          id="page-{{page.id}}"
        />
        <label class="custom-control-label" for="page-{{page.id}}"
          >{{page.title}}</label
        >
      </div>

      <!-- <div class="col-md-11" ng-bind="page.title"></div> -->
      <div class="col-md-1"></div>
      <div class="col-md-11 small" ng-show="page.isActived">
        <input
          type="checkbox"
          ng-model="page.isExportData"
          ng-change="$ctrl.updatePageExport()"
        />
        With data
      </div>
    </div>
  </div>
</section>
<!-- /.content -->
